﻿@{
    Layout = "~/Views/Shared/_FormWhite.cshtml";
}
@inject Microsoft.AspNetCore.Hosting.IWebHostEnvironment HostingEnvironment
@section header{
    <link href="@Url.Content("~/ajax/libs/summernote/summernote.css")" rel="stylesheet" type="text/css">
    <script src='@Url.Content("~/ajax/libs/summernote/summernote.js")' type="text/javascript"></script>
    <script src='@Url.Content("~/ajax/libs/summernote/summernote-zh-CN.js")' type="text/javascript"></script>

    @BundlerHelper.Render(HostingEnvironment.ContentRootPath, Url.Content("~/ajax/libs/imageupload/1.0/css/imgup.min.css"))
    @BundlerHelper.Render(HostingEnvironment.ContentRootPath, Url.Content("~/ajax/libs/imageupload/1.0/js/imgup.js"))

    @BundlerHelper.Render(HostingEnvironment.ContentRootPath, Url.Content("~/ajax/libs/bootstrap.tagsinput/0.8.0/bootstrap-tagsinput.min.css"))
    @BundlerHelper.Render(HostingEnvironment.ContentRootPath, Url.Content("~/ajax/libs/bootstrap.tagsinput/0.8.0/bootstrap-tagsinput.min.js"))
}

<div class="wrapper animated fadeInRight">
    <form id="form" class="form-horizontal m">
        <input type="hidden" id="id" name="id" />
        <div class="form-group">
            <label class="col-sm-2 control-label ">标题 <font class="red"> *</font> </label>
            <div class="col-sm-10">
                <input id="newsTitle" name="newsTitle" type="text" class="form-control" />
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-2 control-label ">文章类别<font class="red"> *</font></label>
            <div class="col-sm-4">
                <div id="newsType" name="newsType"></div>
            </div>
            <label class="col-sm-2 control-label ">发布时间<font class="red"> *</font></label>
            <div class="col-sm-4">
                <input id="newsDate" name="newsDate" type="text" class="form-control" />
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-2 control-label ">作者<font class="red"> *</font></label>
            <div class="col-sm-4">
                <input id="newsAuthor" name="newsAuthor" type="text" class="form-control" />
            </div>
            <label class="col-sm-2 control-label ">排序<font class="red"> *</font></label>
            <div class="col-sm-4">
                <input id="newsSort" name="newsSort" type="text" class="form-control" />
            </div>
        </div>
        @await Html.PartialAsync("/Areas/SystemManage/Shared/AreaFormPartial.cshtml", new ViewDataDictionary(this.ViewData) { { "Label", "2" }, { "Content", "10" } })
        <div class="form-group">
            <label class="col-sm-2 control-label ">文章标签</label>
            <div class="col-sm-10">
                <input id="newsTag" name="newsTag" type="text" class="form-control" />
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-2 control-label ">
                <span>缩略图</span><br />
                <span>(宽高比 1.5：1)</span>
            </label>
            <div class="col-sm-10">
                <div id="thumbImage" class="img-box">
                </div>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-2 control-label ">文章内容 </label>
            <div class="col-sm-10">
                <div id="newsContent" class="summernote"></div>
            </div>
        </div>
    </form>
</div>

<script type="text/javascript">
    var id = ys.request("id");
    $(function () {
        //初始时间
        layui.use('laydate', function () {
            var laydate = layui.laydate;
            var startDate = laydate.render({
                elem: '#newsDate',
                theme: 'molv',
                type: 'datetime',
                format: 'yyyy-MM-dd HH:mm',
                trigger: 'click',
            });
        });
        $('#newsTag').tagsinput({ trimValue: true });
        //初始化类型
        var newsTypeJson = [
            { DictKey: 1, DictValue: "产品案例", ListClass: "primary", DictStatus: 1, IsDefault: 1, ListClass: "primary", Remark: "" },
            { DictKey: 2, DictValue: "行业新闻", ListClass: "warning", DictStatus: 1, IsDefault: 0, ListClass: "warning",Remark: ""}
        ];
        $("#newsType").ysComboBox({
            data: newsTypeJson,
            key: "DictKey",
            value: "DictValue",
            class: "form-control"
        });
        //初始化富文本框
        $('#newsContent').summernote({
            height: '220px',
            lang: 'zh-CN',
            dialogsInBody: true,
            callbacks: {
                 //上传时调用
                onImageUpload: function (files, editor, welEditable) {
                    uploadNewsImage(files[0], editor, welEditable);
                },
                //删除时调用
                onMediaDelete: function (target) {
                    debugger
                    var imgsrc = target[0].currentSrc.split("/");
                    var id = imgsrc[imgsrc.length - 1].substring(0, imgsrc[imgsrc.length - 1].length - 4);
                    deleteThumbImage(id);
                }
            }
        });
        //图片上传初始化
        $("#thumbImage").imageUpload({
            uploadImage: 'uploadThumbImage',
            deleteImage: 'deleteThumbImage',
            limit: 3,
            context: "/admin"
        });

        getForm();

        $("#form").validate({
            rules: {
                newsTitle: { required: true },
                newsType_select: { required: true },
                newsDate: { required: true },
                newsAuthor: { required: true },
                newsSort: { required: true }
            }
        });
    });

    function getForm() {
        //修改赋值使用
        var editData = storage.get("editData");
        if (editData != null && editData.length > 0) {
            var data = JSON.parse(editData);
            $("#newsContent").summernote('code', data.newsContent);
            $("#thumbImage").imageUpload("setImageUrl", { id: data.thumbImage, url: data.imgUrl});
            //表单赋值
            $("#form").setWebControls(data);
            $.each(data.newsTag.split(','), function (index, val) {
                $('#newsTag').tagsinput('add', val);
            });
        } else {
            //界面初始化 给状态、性别赋值
            var defaultData = {};
            $("#form").setWebControls(defaultData);
        }
    }

    //提交数据
    function submitForm(index) {
        if ($("#form").validate().form()) {
            var postData = $("#form").getWebControls();
            postData.NewsContent = $("#newsContent").summernote('code');
            postData.ThumbImage = $("#thumbImage").imageUpload("getImageId");
            $.operate.save("/OrganizationManage/News/SaveFormJson", postData);
        }
    }
    //富文本框上传图片
    function uploadNewsImage(file, editor, welEditable) {
        var formdata = new FormData();
        formdata.append("fileList", file);
        ys.ajaxUploadFile({
            url: '/File/UploadFile?fileModule=@UploadFileType.News.ParseToInt()',
            data: formdata,
            async: true,
            success: function (obj) {
                if (obj.code == 1000) {
                    $("#newsContent").summernote('insertImage', obj.data.imagePath, '/');
                }
                else {
                    ys.msgError(obj.msg);
                }
            }
        })
    }
    //文件上传
    function uploadThumbImage(file, callback) {
        var formdata = new FormData();
        formdata.append("fileList", file);
        ys.ajaxUploadFile({
            url: '/File/UploadFile?fileModule=@UploadFileType.News.ParseToInt()',
            data: formdata,
            success: function (obj) {
                if (obj.code == 1000) {
                    if (callback) {
                        callback(obj);
                    }
                }
                else {
                    ys.msgError(obj.msg);
                }
            }
        })
    }
    //删除图片
    function deleteThumbImage(obj, callback) {
        ys.ajax({
            url: '/File/DeleteFile',
            type: "post",
            data: { "ids": obj },
            dataType: "json",
            success: function (obj) {
                if (obj.code == 1000) {
                    if (callback) {
                        callback(obj);
                    }
                }
                else {
                    ys.msgError(obj.msg);
                }
            }
        })
    }
</script>

